﻿<!DOCTYPE HTML>
<html>
<head>
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="viewport"
          content="width=device-width, initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>红包详情</title>
    {include file='common/header'}
    <style type="text/css">
.content {
    background: #EBE3D6;

    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
	top: 47px;
}
 .hong {
    height: 100px;
    overflow: hidden;
}
.hong span {
    background: #D75940;
    height: 200px;
    border-radius: 0 0 50% 50%;
    width: 110%;
    margin-left: -5%;
    display: block;
    margin-top:-100px;
}
.top {
    text-align: center;
    font-size: 14px;
}

.top .avatar img {
    width: 100%;
}
.top .avatar {
    width: 50px;
    display: inline-block;
    border-radius: 50%;
    overflow: hidden;
    height: 50px;
    border: 1px solid #ECCF95;
    background: #ECCF95;
    margin-top: -25px;
}

.top .a {
    font-size: 14px;
    color: #91919B;
    margin-top: 6px;
}

.top .price {
    font-size:28px;
    margin-top: 20px;
}

.top .price .currency {
    font-size:14px;
    display: inline-block;
    width: 0;
}

.ling {
    font-size: 14px;
    margin: 14px 0 0 10px;
    color: #91919B;
}

.list-block {
    margin: 10px 0 0 0;
    font-size: 12px;
}

.list-block ul {
  
    list-style: none;
    padding: 0;
    margin: 0;
    position: relative;
}

.list-block ul:before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    bottom: auto;
    right: auto;
    height: 1px;
    width: 100%;
    background-color: #e7e7e7;
    display: block;
    z-index: 15;
    -webkit-transform-origin: 50% 0;
    transform-origin: 50% 0;
}

.list-block li {
    box-sizing: border-box;
    position: relative;
}

.list-block .item-content {
    box-sizing: border-box;
    padding-left: 15px;
    min-height: 70px;

    display: flex;
 
    justify-content: space-between;
 
    align-items: center;
}

.list-block.media-list .item-media {
    padding-top: 10px;
    padding-bottom: 10px;
}

.list-block.media-list .item-inner {
    display: block;
    padding-top: 15px;
    padding-bottom: 10px;
    align-self: stretch;
        margin-left: 10px;
        padding-right: 15px;
}
.list .avatar {
    width: 50px;
    height:50px;
    display:block;
    border-radius: 50%;
    max-width:initial;
}

.list-block .item-inner {
    padding-right: 10px;
    position: relative;
    width: 100%;
    padding-top: 10px;
    padding-bottom: 6px;
    min-height: 25px;
    overflow: hidden;
    box-sizing: border-box;

    display: flex;

    justify-content: space-between;
   
    align-items: center;
}

list .item-title-row {
    margin-top: 4px;
}

item-title {
   
    flex-shrink: 1;
    white-space: nowrap;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.list .item-after {
    font-size: 12px;
    color: #3d4145;
}
.list-block .item-after {
    white-space: nowrap;
    color: #5f646e;
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    -webkit-flex-shrink: 0;
    flex-shrink: 0;
    margin-left: .25rem;
    display: -webkit-box;
    display: -webkit-flex;
    display: flex;
    max-height: 1.4rem;
}

.list .item-subtitle {
    font-size: 12px;
    color: #91919B;
    height:20px;
    line-height: 20px;
}
.luck-best {
    width: 55px;
    float: right;
    background-color: #FDF1B2;
    color: #DB5360;
    font-weight: bold;
    text-align: center;
    border-radius: 5px;
    font-size: 10px;
}

.list-block .item-inner:after {
    background-color: #cfcfcf;
}

.list-block .item-inner:after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    right: auto;
    top: auto;
    height: 1px;
    width: 100%;
    background-color: #e7e7e7;
    display: block;
    z-index: 15;
    -webkit-transform-origin: 50% 100%;
    transform-origin: 50% 100%;
}

.list-block.media-list .item-title-row{
	display:flex;
	justify-content: space-between;
	height:20px;
	line-height: 20px;
}
    </style>
</head>

<body data-offset="140" id="htmlBody">
<div class="site-header header-fixed" style="background:#D75940;">
    <a onclick="history.back()" class="back"></a>
    <div class="tit-name">红包详情
    
		
                
    </div>
</div>


  <div infinite-scroll-disabled="loading" infinite-scroll-distance="30" class="content native-scroll">
   <!----> 
   <div class="hong">
    <span></span>
   </div> 
   <div class="top">
    <div class="avatar">
     <img src="{$redpackage['avatar']}" />
    </div> 
    <div class="nickname">
     {$redpackage['nickname']}
    </div> 
    <div class="a">
     恭喜发财，大吉大利
    </div> 
    <div class="price">
     {$redpackage['money']}
     <span class="currency">元</span>
    </div>
   </div> 
   <div class="ling">
    领取{php} echo count($redpackage_record);{/php}/{$redpackage['number']}个
   </div> 
   <div class="list list-block media-list">
    <ul>
    	{volist name='redpackage_record' id='d'}
     <li>
      <div class="item-content">
       <div class="item-media">
        <img src="{$d['avatar']}" class="avatar" />
       </div> 
       <div class="item-inner">
        <div class="item-title-row">
         <div class="item-title">
          ㅤ	{$d['nickname']}
         </div> 
         <div class="item-after">
          {$d['money']}元
         </div>
        </div> 
        <div class="item-subtitle">
         {$d['add_time']|date='Y-m-d H:i:s',###}
         <!---->
        </div>
       </div>
      </div>
      </li>
{/volist}

 


    </ul>
   </div> 

  </div>







</body>
</html>